<!-- 消防隐患列表 -->
<template>
	<view class="page">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block style="color: #777777;font-size: 32rpx;" slot="content">消防隐患列表</block>
		</cu-custom>
		<scroll-view scroll-x class="bg-white nav">
			<view class="flex text-center">
				<view class="cu-item flex-sub" :class="index == TabCur ? 'text-orange cur' : ''"
					v-for="(item, index) in navs" :key="index" @tap="tabSelect" :data-id="index">
					{{ item.name }}
					<u-badge :value="item.num" max="999" bgColor="#DC0000" :absolute="true" :offset="[14,8]" ></u-badge>
				</view>
			</view>
		</scroll-view>
		<view style="margin: 20rpx 0;">
			<view class="cu-bar search bg-white">
				<view class="search-form">
					<text class="cuIcon-search"></text>
					<input v-model="name" :adjust-position="false" type="text" placeholder="请输入消防隐患名称"
						confirm-type="search"></input>
				</view>
				<view class="action">
					<button @click="refresh" class="cu-btn bg-system-blue shadow-blur round">搜索</button>
				</view>
			</view>
		</view>
		<view v-if="!dataEmpty" :style="{ 'height': scrollHeight + 'px' }" style="overflow: hidden;">
			<movable-refresh ref="movableRefresh" :scrollHeight="scrollHeight" :noMore="noMore" :showGoTop="true"
				@refresh="refresh" @loadMore="loadMore" @="scrollTop">
				<view>
					<view class="content" v-for="(item, index) in list" :key="index">
						<view class="pd">
							<text class="title">{{ item.name }}</text>
							<p class="list-box">
								<text class="list-info">描述：</text>
								<text class="wbqy list-title">{{ item.remark || '暂无' }}</text>
							</p>
							<p class="list-box">
								<text class="list-info">状态：</text>
								<text class="wbqy" :class="[classObject(item.statusStr)]">{{ item.statusStr || '暂无' }}</text>
							</p>
							<button class="my-btn cu-btn bg-blue shadow" @click="see_detail(item.ucId)">详情</button>
						</view>
					</view>
				</view>
			</movable-refresh>
		</view>
		<view v-if="dataEmpty" class="empty">
			<p>暂无数据</p>
		</view>
		<message />
	</view>
</template>

<script>
	import movableRefresh from '@/components/zyq-movableRefresh/zyq-movableRefresh.vue'
	export default {
		components: {
			movableRefresh
		},
		onLoad() {
			let system = uni.getSystemInfoSync()
			this.scrollHeight = system.windowHeight - system.statusBarHeight - 50
		},
		onShow() {
			if (!this.mark) {
				return
			}
			this.mark = false
			this.tj()
			this.refresh()
		},
		data() {
			return {
				TabCur: 0,
				scrollLeft: 0,
				navs: [
					{
						name: '待处理',
						num: '',
					},
					{
						name: '办理中',
						num: '',
					},
					{
						name: '已上报',
						num: '',
					},
				],
				list: [],
				scrollHeight: 350,
				noMore: false,
				pageNum: 1,
				pageSize: 10,
				dataEmpty: false,
				name: null,
				urlvalue: '/wx/inHiddenDanger/getInHiddenDangerPage',
				mark: true
			}
		},
		computed: {
			classObject(val) {
				return function(val) {
				let className = '';
				switch (val) {
					case '已分配':
						className = 'text-yellow'
						break;
					case '已确认':
						className = ''
						break;
					case '开始执行':
						className = 'text-green'
						break;
					case '执行中':
						className = 'text-green'
						break;
					case '已生成':
						className = 'text-yellow'
						break;
					case '企业管理员审核中':
						className = 'text-blue'
						break;
					case '企业管理员审核整改时间':
						className = 'text-blue'
						break;
					case '隐患误报':
						className = 'text-green'
						break;
					case '已延期，监督员审核中':
						className = 'text-red'
						break;
					case '监督员审核中':
						className = 'text-blue'
						break;
					case '监督员审核整改时间':
						className = 'text-blue'
						break;
					case '已延期，监督员未处理':
						className = 'text-red'
						break;
					default:
						className = ''
						break;
				}
				return className
				}

			},
		},
		methods: {
			tj(){
				let that = this
				let app = getApp()
				app.globalData.request({
					url: 'wx/firealarm/yhStatistics',
				}).then(function(res) {
					that.navs[0].num = res.data.data.dclyhgd 
					that.navs[1].num = res.data.data.blzyhgd
					that.navs[2].num = res.data.data.myyhgd
				}).catch(function(e) {})
			},
			cancel() {
				this.name = ''
				this.refresh()
			},
			tabSelect(e) {
				if (!this.mark) {
					return
				}
				this.mark = false
				this.TabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
				if (this.TabCur == 0) {
					this.urlvalue = '/wx/inHiddenDanger/getInHiddenDangerPage'
				} else if (this.TabCur == 1) {
					this.urlvalue = '/wx/inHiddenDanger/getExamineDangerPage'
				} else {
					this.urlvalue = '/wx/inHiddenDanger/getMyReportDangerPage'
				}
				this.refresh()
			},
			scrollTop(scrollTop) {
				this.scrollTop = scrollTop
			},
			refresh() {
				this.dataEmpty = false
				this.pageNum = 1
				let that = this
				that.noMore = false
				let list = []
				// 封装参数
				let params = {
					"pageNum": that.pageNum,
					"pageSize": that.pageSize,
					"name": this.name
				}
				// 请求数据
				let app = getApp()
				app.globalData.request({
					url: that.urlvalue,
					data: params
				}).then(function(res) {
					let datas = res.data.data.list
					let recors = []
					for (let i = 0; i < datas.length; i++) {
						recors.push(datas[i])
					}
					that.list = recors
					that.pageNum++
					if (res.data.data.pages === 1) {
						that.noMore = true
					}
					if (that.list.length == 0) {
						that.dataEmpty = true
					} else {
						that.dataEmpty = false
					}
					if (that.$refs.movableRefresh) {
						let that_ = that
						setTimeout(function() {
							that_.$refs.movableRefresh.endLoad() //刷新结束
						}, 1000)
					}
					that.mark = true
				}).catch(function(e) {
					that.mark = true
					uni.showToast({
						title: "请稍后再试",
						icon: 'none'
					})
				})
			},
			loadMore() {
				if (this.noMore) {
					return
				}

				let list = this.list
				let that = this
				if (that.pageNum) {

				}
				// 封装参数
				let params = {
					"pageNum": this.pageNum,
					"pageSize": this.pageSize,
					"name": this.name
				}
				// 请求数据
				let app = getApp()
				app.globalData.request({
					url: that.urlvalue,
					data: params
				}).then(function(res) {
					let datas = res.data.data.list
					for (let i = 0; i < datas.length; i++) {
						list.push(datas[i])
					}
					that.list = list


					that.pageNum++
					if (res.data.data.pages === that.pageNum) {
						that.noMore = true
					}

					if (that.$refs.movableRefresh) {
						let that_ = that
						setTimeout(function() {
							that_.$refs.movableRefresh.endLoad() //刷新结束
						}, 1000)
					}
				}).catch(function(e) {

				})
			},
			see_detail(ucId) {
				if (this.TabCur == 0) {
					uni.navigateTo({
						url: '../yhxq/yhxq?ucId=' + ucId
					});
				} else {
					uni.navigateTo({
						url: '../yhxx/yhxx?ucId=' + ucId
					});
				}
			}
		}
	}
</script>

<style scoped>
	.pd {
		background-color: #FFFFFF;
		margin: 20rpx 0;
		padding: 20rpx 0;
	}

	.pd text {
		display: flex;
		/* margin-left: 20rpx; */
		font-size: 24rpx;
		/* color: #151515; */
		letter-spacing: 0.39px;
		line-height: 50rpx;
	}

	.pd .title {
		font-size: 32rpx;
		color: #333333;
	}

	.pd .zxr {
		color: #19be6b;
	}

	.pd .my-btn {
		position: absolute;
		right: 16px;
		margin-top: -40px;
	}

	.list-title {
		color: #333;
	}
</style>
